<template>
	<view @click="show=true">
		<u-picker :show="show" :columns="options" @confirm="changeHandle" @cancel="cancelHandle" keyName="dictLabel"></u-picker>
		<u-input v-model="selectValue" :placeholder="placeholder" disabled />
	</view>
</template>

<script>
export default {
	data() {
        return {
			show: false,
			options: [],
			selectValue: null
        }
	},
	props: {
		value: [String, Number],
		dictType: {
		    type: String,
		    default: ""
		},
		placeholder: {
		    type: String,
		    default: ""
		}	
	},
	computed: {
		nativeValue() {
			return this.value;
	    }
	},
	watch: {
		//value改变
		nativeValue(value) {
			//赋初始值
			if(value || value == 0) {
				for(let i in this.options[0]) {
					let d = this.options[0][i];
					if(d.dictValue == value) {
						this.selectValue = d.dictLabel;
						break;
					}
				}
			}
		}
	},
	created() {
	    this.initData();
	},
	mounted() {
		
	},
	methods: {
	    async initData() {
			await this.$u.api.dict.getDicts(this.dictType).then((res) => {
				const { data } = res;				
				this.options = [ data ];
			});
	    },
		cancelHandle() {
			this.show = false;
		},
	    changeHandle(e) {
			let { value } = e;
			this.show = false;
			this.$emit('input', value[0].dictValue);
			this.$emit('change', value[0].dictValue);
	    }
	}
};
</script>

<style scoped>

</style>